<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" type="text/css" href="../css/mui.css"/>
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="../css/general.css"/>
		<style type="text/css">
				.mui-input-row .mui-btn {
			    float: right;
			    width: 65%;
			    padding: 11px 15px;
			}
			
			 input[type=radio]{
        /*去除浏览器默认样式*/
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        /*自定义样式*/
        position: relative;
        display: inline-block;
        vertical-align: top;
        width: 1.5em;
		height: 1.5em;
        border: 1px solid #00bfff;
        outline: none;
        cursor: pointer;
        /*设置为圆形，看起来是个单选框*/
        -webkit-border-radius: 20px;
        -moz-border-radius: 20px;
        border-radius: 20px;
    }
 
    /**
    * 单选框 选中之后的样式
    **/
    input[type=radio]:after{
        content: '';
        position: absolute;
        width: 0.5em;
        height: 0.5em;
        display: block;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        margin: auto;
        background: #00bfff;
        -webkit-border-radius: 12px;
        -moz-border-radius: 12px;
        border-radius: 12px;
        -webkit-transform: scale(0);
        -moz-transform: scale(0);
        transform: scale(0);
        /*增加一些动画*/
        -webkit-transition : all ease-in-out 300ms;
        -moz-transition : all ease-in-out 300ms;
        transition : all ease-in-out 300ms;
    }
    input[type=radio]:checked:after{
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        transform: scale(1);
    }
input[type=text]{
       text-align: right;
    }
    	.radios{
    		width: 60%;
    		height: 40px;
    		display: flex;
    		justify-content: space-around;
    		align-items: center;
    	}
    .maindiv{
		width: 100%;
		background-color: white;
		padding: 0.5em;
	}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav hbg">
		    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left colorw"></a>
		    <h1 class="mui-title">自定义</h1>
		</header>
		<div class="mui-content">
			<div class="maindiv">
				
		    <div class="mui-input-row">
		        <label>自定义名称</label>
		        <input id="name" type="text" placeholder="输入自定义名称">
		    </div>
			</div>
			<div class="maindiv">
		    	<div class="mui-input-row">
	    	        <label>类型</label>
	    	        <div class="radios">
	    	        	<input id="2" name="radio" type="radio" value="2" checked>支出
	    	        	<input id="1" name="radio" type="radio" value="1">收入
	    	        </div>
		    	</div>
			</div>
			<div class="maindiv">
		     	<button id="subbut" type="button" class="mui-btn mui-btn-blue mui-btn-block">确定</button>
			</div>
		    
		    
		    
		    
		</div>
		<script src="../js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/mui.min.js"></script>
		<script src="../js/req.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/muishow.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			var typenum = 2,sid = 0;
			window.onload = function(){
				sid = getrequest().sid||0;
				mui.plusReady(function(res){
					 sid = plus.webview.currentWebview().sid||0;
				})
				if(sid > 0){
					getsort(sid);
				}
				$("input[type=radio]").on("change",function(res){
					console.log(this.value);
					typenum = this.value;
					console.log(typenum);
				})
				
				g("subbut").addEventListener("tap",function(e){
					if("" != g("name").value|| " " != g("name").value){
						var data = {}
						if(sid>0){
							console.log(sid)
							data = {
							url:"/api/income_sort/edit",
								data:{
									access_token:acctoken(),
									id:sid,
									name:g("name").value||"",
									type: parseInt(typenum),
								}
							}
							console.log(data);
						}else{
							data = {
							url:"/api/income_sort/add",
								data:{
									access_token:acctoken(),
									name:g("name").value||"",
									type: parseInt(typenum),
								}
							}
						}
						
						ajax(data,function(res){
							console.log(res);
							mui.toast(res.msg);
							//g("name").value = "";
							back_show();
						})
					}else{
						mui.toast("请填写自定义名称");
					}
					
				})
			}
			function getsort(sortid){
				var data = {
					url:"/api/income_sort/detail",
					data:{
						access_token:acctoken(),
						id:sortid
					}
				}
				ajax(data,function(res){
					console.log("分类详情",res);
					g("name").value = res.data.name;
					g(res.data.type).click();
				})
			}
		</script>
	</body>

</html>